<template>
	<view class="">
		<view class="conttitle main" style="cursor: pointer;">
			<view style="height: 100%;">
				<view style="margin-top: 10px;" class="name"><span>剑魂</span><span>本人</span></view>
				<view style="margin-top: 20px;" class="phone">622*********0909</view>
			</view>
			<view style="margin-top: 20px;" class="mor">
				<view class="citimg">
					<img src="../../../static/cut.png" alt="">
				</view>
				切换就诊人
			</view>
		</view>
		<!-- 相关报告 -->
		<view class="zp">
			<view class="server">选择查询报告类型</view>
			<view class="server1" @click="toreport">
				<view>病理报告单</view>
				<view class="izpimg"><img src="@/static/addmore.png" alt=""></view>
			</view>
			<view class="server1" @click="toreport">
				<view>检查报告单</view>
				<view class="izpimg"><img src="@/static/addmore.png" alt=""></view>
			</view>
			<view class="server1" @click="toreport">
				<view>检验报告单</view>
				<view class="izpimg"><img src="@/static/addmore.png" alt=""></view>
			</view>
			<view class="server1" @click="toreport">
				<view>体检报告单</view>
				<view class="izpimg"><img src="@/static/addmore.png" alt=""></view>
			</view>
		</view>
		<!-- 提示 -->
		<view class="tip">
			<text>报告单内容仅供参考，最终结果已医院打印报告为准，最终解释权归本院所有。</text>
		</view>
	</view>

</template>

<script>
	export default {
		methods: {
			toreport() {
				uni.navigateTo({
					url: '/query/page/report/report'
				})
			}
		}
	}
</script>

<style>
	.main {
		width: 88%;
		margin: 0 auto;
	}

	.izpimg img {
		width: 10px;
		height: 10px;
		margin-right: 30px;
	}

	.server1 {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		color: #757575;
		height: 56px;
		line-height: 56px;
		border-bottom: 1px solid rgba(242, 242, 242, 1);
		font-size: 15px;
	}

	.citimg {
		width: 40rpx;
		height: 40rpx;
		margin: 0 auto 12rpx;
	}

	.citimg img {
		width: 40rpx;
		height: 40rpx;
	}
	.conttitle {
		background-color: #f5f9ff;
		height: 80px;
		display: flex;
		font-weight: 200;
		border: 1px solid #f2f2f2;
		padding: 20px 10px;
		justify-content: space-between;
		margin-top: 15px;
	}

	.mor {
		font-family: 'PingFangSC-Light', 'PingFang SC Light', 'PingFang SC', sans-serif;
		font-weight: 200;
		font-style: normal;
		font-size: 12px;
	}

	.phone {
		font-weight: 200;
		font-style: normal;
		font-size: 12px;
		color: #AAAAAA;
	}

	.name span:nth-child(1) {
		font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: 15px;
		color: #555555;
	}

	.name span:nth-child(2) {
		margin-left: 5px;
		font-size: 12px;
		display: inline-block;
		width: 44px;
		height: 18px;
		padding: 2px;
		background-color: #e2edfe;
		text-align: center;
		line-height: 18px;
		border-radius: 10px;
		letter-spacing: 1px;
		color: #006EFF;
	}

	.zp {

		margin: 0 10px;
		width: 100%;
	}

	.server {
		height: 56px;
		line-height: 56px;
		border-bottom: 1px solid rgba(242, 242, 242, 1);
		font-size: 17px;
	}

	.tip {
		margin: 20rpx auto 0;
		padding: 0 20rpx;
		width: 686rpx;
		height: 144rpx;
		display: flex;
		align-items: center;
		border-radius: 8px;
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;
		font-family: 'PingFangSC-Light', 'PingFang SC Light', 'PingFang SC', sans-serif;
		font-size: 12px;
		color: #AAAAAA;
		background-color: rgba(242, 242, 242, 0.509803921568627);
		font-weight: 200;
		font-size: 24rpx;
		text-align: left;
		line-height: 48rpx;
	}
</style>